<!DOCTYPE html>
<html lang="en">
    <head>
		<meta charset="UTF-8">
		<title>申请详情页面</title>
		<link rel="stylesheet" href="__ADMIN_PATH__/component/pear/css/pear.css" />
	</head>
	<body>
		<form class="layui-form" action="">
			<div class="mainBox">
				<div class="main-container">

					<div class="layui-form-item">
						<label class="layui-form-label">真实名称</label>
						<div class="layui-input-block">
							<input type="text" autocomplete="off" class="layui-input" value="{$info['real_name'] ?= $info['real_name']}" readonly="" />
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">性别</label>
						<div class="layui-input-block">
							<input type="text" autocomplete="off" class="layui-input" value="{$info['sex_name'] ?= $info['sex_name']}" readonly="" />
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">年龄</label>
						<div class="layui-input-block">
							<input type="text" autocomplete="off" class="layui-input" value="{$info['age'] ?= $info['age']}" readonly="" />
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">工龄</label>
						<div class="layui-input-block">
							<input type="text" autocomplete="off" class="layui-input" value="{$info['work_year'] ?= $info['work_year']}" readonly="" />
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">手机号</label>
						<div class="layui-input-block">
							<input type="text" autocomplete="off" class="layui-input" value="{$info['mobile'] ?= $info['mobile']}" readonly="" />
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">意向城市</label>
						<div class="layui-input-block">
							<input type="text" autocomplete="off" class="layui-input" value="{$info['city_name'] ?= $info['city_name']}" readonly="" />
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">个人生活照</label>
						<div class="layui-input-block">
							<ul class="plug-file-upload-view service-self_img-view" data-form-name="self_img[]" data-max-number="9" data-delete="1" data-dialog-type="images">
								{if condition="!empty($info['self_img'])"}
								    {php}$self_img_array = explode(",", $info['self_img']);{/php}
								    {foreach name="self_img_array" item="value"}
								        <li>
								        	<img class="image-show" src="{$value}" height="100" />
								        </li>
								    {/foreach}
								{/if}
							</ul>
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">昵称</label>
						<div class="layui-input-block">
							<input type="text" autocomplete="off" class="layui-input" value="{$info['nickname'] ?= $info['nickname']}" readonly="" />
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">所在地址</label>
						<div class="layui-input-block">
							<input type="text" autocomplete="off" class="layui-input" value="{$info['address'] ?= $info['address']}" readonly="" />
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">服务项目</label>
						<div class="layui-input-block">
							{if condition="!empty($info['service_list'])"}
								{foreach name="info.service_list" item="value"}
									<input type="checkbox" name="" title="{$value['title']}" checked>
								{/foreach}
							{/if}
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">技师简介</label>
						<div class="layui-input-block">
							<textarea class="layui-textarea">{$info['descs'] ?= $info['descs']}</textarea>
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">身份证</label>
						<div class="layui-input-block">
							<ul class="plug-file-upload-view">
								{if condition="!empty($info['id_card_img'])"}
								    {php}$id_card_img_array = explode(",", $info['id_card_img']);{/php}
								    {foreach name="id_card_img_array" item="value"}
								        <li>
								        	<img class="image-show" src="{$value}" height="100" />
								        </li>
								    {/foreach}
								{/if}
							</ul>
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">资格证书</label>
						<div class="layui-input-block">
							<ul class="plug-file-upload-view">
								{if condition="!empty($info['diploma_img'])"}
								    {php}$diploma_img_array = explode(",", $info['diploma_img']);{/php}
								    {foreach name="diploma_img_array" item="value"}
								        <li>
								        	<img class="image-show" src="{$value}" height="100" />
								        </li>
								    {/foreach}
								{/if}
							</ul>
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">工作形象照</label>
						<div class="layui-input-block">
							<ul class="plug-file-upload-view">
								{if condition="!empty($info['work_img'])"}
								    <li>
							        	<img class="image-show" src="{$info['work_img']}" height="100" />
							        </li>
								{/if}
							</ul>
						</div>
					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">视频介绍</label>
						<div class="layui-input-block">
							<ul class="plug-file-upload-view">
								{if condition="!empty($info['video'])"}
								    <li>
							        	<video src="{$info['video']}" height="500" controls></video>
							        </li>
								{/if}
							</ul>
						</div>
					</div>

				</div>
			</div>
		</form>
		<script src="__ADMIN_PATH__/component/layui/layui.js"></script>
		<script src="__ADMIN_PATH__/component/pear/pear.js"></script>
		<script>
			layui.use(['form', 'jquery', 'popup', 'loading'], function() {
				let form = layui.form;
				let $ = layui.jquery;
				var popup = layui.popup;
				let loading = layui.loading;

				//图片放大
				$(document).on('click', '.image-show', function () {
					var url = $(this).attr('src');
					//获取当前窗口的宽度
					var scr_width = $(window).width();
					if (scr_width > 1200) {
						xp=600;   //大屏幕
					} else if (scr_width > 860) {
						xp=500;   //中屏幕
					} else {
						xp=300;   //超小屏幕
					}

					console.log(url);
					function getImageWidth(url, callback) {
						var img = new Image();
						img.src = url;
						if (img.complete) {
							callback(img.width, img.height)
						} else {
							img.onload = function () {
								callback(img.width, img.height)
							}
						}
					}
					getImageWidth(url, function (width, height) {
						if (height > xp) {
							var ratio = width / height;
							height = xp;
							width = height * ratio
						}
						if (width > xp) {
							var ratio = height / width;
							width = xp;
							height = width * ratio
						}
						layer.closeAll();
						layer.open({
							type: 1,
							closeBtn: 1,
							shade: false,
							title: false,
							shadeClose: false,
							area: ["auth", "auth"],
							content: '<img src="' + url + '" width="' + width + 'px" height="' + height + 'px">'
						})
					})
				});
			});
		</script>
		<style type="text/css">
			.plug-file-upload-view li
			{
				display: inline;
			}
		</style>
    </body>
</html>